
tabCard('.toggle-login a','.tabContent')

let user = document.querySelector("#user");
let pwd = document.querySelector("#pwd");


let inputIcon = document.querySelector("#input-icon");
// console.log(inputIcon);

let inputIcons = document.querySelector("#input-icons");
// console.log(inputIcons);

let modelBtn = document.querySelector("#model-btn");


/* 1.判断 如果输入用户名长度大于0，则显示叉叉图标 否则隐藏 */
user.addEventListener("input", function () {
    if (user.value.length > 0) {
      inputIcon.style.display = "block";
    } else {
      inputIcon.style.display = "none";
    }
  });
  
  /*2. 点击叉叉图标，清空内容并隐藏 自己 */
  inputIcon.addEventListener("click", function () {
    user.value = "";
    inputIcon.style.display = "none";
  });
  
  /* 3.判断 如果输入用户名长度大于0，则显示叉叉图标 否则隐藏 */
  pwd.addEventListener("input", function () {
    if (pwd.value.length > 0) {
      inputIcons.style.display = "block";
    } else {
      inputIcons.style.display = "none";
    }
  });
  
  /*4. 点击叉叉图标，清空内容并隐藏 自己 */
  inputIcons.addEventListener("click", function () {
    pwd.value = "";
    inputIcons.style.display = "none";
  });

 
  
  //创建账号验证规则--正则表达式
  let reg =
    /^(13[0-9]|14[01456879]|15[0-3,5-9]|16[2567]|17[0-8]|18[0-9]|19[0-3,5-9])\d{8}$/;
  //创建密码验证规则--正则表达式
  let regs = /^\d{6}$/;
  
  /* 5.判断账号是否有值-- 账号失去焦点时，验证是否合法 (用正则表达式)
      如果为真，账号验证就为空，如果为假，就输出账号错误
      账号验证userMsg(是在input框下面的文字)
  */
  user.addEventListener("blur", function () {
    // console.log(user);
  
    //使用reg验证输入信息是否正确=布尔值
    let bool = reg.test(user.value);
  
    if (bool) {
      //bool为真
      userMsg.textContent = "";
    } else {
      userMsg.textContent = "账号错误";
    }
  });
  
  /* 6.判断密码pwd是否为六位数字---密码失去焦点时，验证是否合法
      如果为真，密码验证pwdMsg就为空，如果为假，就输出密码必须为六位数字
  
  */
  pwd.addEventListener("blur", function () {
    //用rges验证输入信息是否正确
    let bool = regs.test(pwd.value);
    if (bool) {
      pwdMsg.textContent = "";
    } else {
      pwdMsg.textContent = "密码必须为六位数字";
    }
  });
  
  /* 7.点击登录按钮，验证账号reg.test(user.value)和密码regs.test(pwd.value)是否正确
  如果账号为假，则输出userMsg.textContent='账号错误'，密码为假，输出pwdMsg.textContent='密码必须为六位数字'
  都不是就跳转页面
  */
  
  modelBtn.addEventListener("click", function () {
    if (!reg.test(user.value)) {
      //只判断失败的情况
      userMsg.textContent = "账号错误";
    } else if (!regs.test(pwd.value)) {
      pwdMsg.textContent = "密码必须为六位数字";
    } else {
      //跳转页面/*  */
      location.href = "../page/API.html";
    }
  });

